<template>
  <el-aside width="200px">
    <el-row class="tac">
      <el-col>
        <el-menu
          default-active="2"
          class="el-menu-vertical-demo"
          @open="handleOpen"
          @close="handleClose"
        >
<!--          <el-menu-item index="1" @click="goPage('DocHome')">
            <i class="el-icon-menu"></i>
            <span slot="title">后台中心</span>
          </el-menu-item>-->

          <el-menu-item index="2" @click="goPage('DocStage')">
            <i class="el-icon-s-order"></i>
            <span slot="title">值班信息</span>
          </el-menu-item>

          <el-menu-item index="3" @click="goPage('application')">
              <i class="el-icon-location"></i>
              <span>预约信息</span>
          </el-menu-item>

          <el-menu-item index="4" @click="goPage('reply')">
            <i class="el-icon-location"></i>
            <span>患者提问</span>
          </el-menu-item>

          <el-menu-item index="5" @click="goPage('im')">
            <i class="el-icon-location"></i>
            <span>在线问诊</span>
          </el-menu-item>
        </el-menu>
      </el-col>
    </el-row>
  </el-aside>
</template>

<script>
export default {
  name: "Nav",
  data() {
    return {

    }
  },
  methods: {
    handleOpen(key, keyPath) {
      console.log(key, keyPath);
    },
    handleClose(key, keyPath) {
      console.log(key, keyPath);
    },

    goPage(link) {
      if (link === "DocHome") {
        this.$router.push("/doctor/home").catch(error => error);
      } else if ((link === "DocStage")) {
        this.$router.push("/doctor/stage").catch(error => error);
      } else if ((link === "application")) {
        this.$router.push("/doctor/application").catch(error => error);
      }else if ((link === "reply")) {
        this.$router.push("/doctor/reply").catch(error => error);
      }else if ((link === "im")) {
        this.$router.push("/doctor/im").catch(error => error);
      }
      else {}
    },
  }
}
</script>

<style scoped>
el-row{
  height: 100%;
}

el-menu{
  border-right:none;
  color: #6AAB9C;
}
el-aside{
  border-right: 1px solid #f5f1f1;
}
</style>
